import React from 'react'
import Admin from "../../../layout/Admin"
import {PageHeader} from "antd"
import EditableTable from "../../../component/EditableTable/EditableTable"
import TaskModel from "../../../model/task"
import Info from "../../../service/info";


class Task extends React.Component {
    constructor(props) {
        super(props)
        this.model = new TaskModel()
        this.state = {
            list: [],
        }
    }

    componentDidMount() {
        this.all()
    }

    all = () => {
        let m = this.model
        m
            .all()
            .then(res => {
                const list = res.data.ok
                list.forEach((p, i) => p.key = (i + 1).toString())
                this.setState({
                    list,
                })
            })
    }

    save = ({old, change,}) => {
        const id = old.Id
        const daynum = Number(change.Daynum)
        const allnum = Number(change.Allnum)
        const addexp = Number(change.Addexp)
        const addcoin = Number(change.Addcoin)
        const everytimerd = Number(change.Everytimerd)
        return this.model
            .change({id, daynum, allnum, addexp, addcoin, everytimerd,})
            .then(resp => {
                if (resp.data.ok === 1) {
                    Info.success('修改成功')
                }
            })
            .then(() => this.all())
    }

    render() {
        const list = this.state.list

        const header = <div style={{background: '#fff'}}>
            <PageHeader title='任务管理'/>
        </div>

        const typeMapper = {
            1: '观看直播',
            2: '注册',
            3: '每日签到',
            4: '每日分享',
            5: '发表评论',
            6: '实名认证',
            7: '预测消费',
            8: '会员充值',
            9: '好友邀请阶段1',
            10: '好友邀请阶段2',
            11: '好友邀请阶段3',
            12: '好友邀请阶段4',
            13: '好友邀请阶段5',
        }

        // Addcoin: 0
        // Addexp: 1
        // Allnum: -1
        // Daynum: 25
        // Everytimerd: 1
        // Id: 1
        const columns = [
            {
                title: '序号',
                dataIndex: 'Id',
                render: (Id) => <span>{Id}</span>
            },
            {
                title: '类型',
                dataIndex: 'Id',
                render: (text, record) => <span>{typeMapper[record.Id]}</span>,
            },

            {
                title: '增加金币',
                dataIndex: 'Addcoin',
                editable: true,
                render: (Addcoin, record) => <span>{Addcoin}</span>,
            },

            {
                title: '增加经验',
                dataIndex: 'Addexp',
                editable: true,
                render: (Addexp, record) => <span>{Addexp}</span>,
            },

            {
                title: '总次数',
                dataIndex: 'Allnum',
                editable: true,
                render: (Allnum, record) => <span>{Allnum === -1 ? '无限制(-1)' : Allnum}</span>,
            },
            {
                title: '每日次数',
                dataIndex: 'Daynum',
                editable: true,
                render: (Daynum, record) => <span>{Daynum === -1 ? '无限制(-1)' : Daynum}</span>,
            },

            {
                title: '是否每次领取',
                dataIndex: 'Everytimerd',
                editable: true,
                render: (Everytimerd, record) => <span>{Everytimerd === 1 ? '是(1)' : '否(0)'}</span>,
            },
        ]

        const table = <div className='list-container'>
            <EditableTable
                dataSource={list}
                columns={columns}
                save={this.save}
            />
        </div>

        return <Admin>
            {header}
            {table}
        </Admin>
    }

}

export default Task
